<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link href="/resources/lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
<link href="/resources/lib/ligerUI/skins/ligerui-icons.css" rel="stylesheet" type="text/css" />
<script src="/resources/lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="/resources/lib/ligerUI/js/ligerui.all.js" type="text/javascript"></script>
<script src="/resources/lib/jquery-validation/jquery.validate.min.js" type="text/javascript"></script> 
<script src="/resources/lib/jquery-validation/jquery.metadata.js" type="text/javascript"></script>
<script src="/resources/lib/jquery-validation/messages_cn.js" type="text/javascript"></script>
<script type="text/javascript">

var manager = null;
var form = null;
var list = '${list}';
var TreeData = JSON.parse(list); 

$(function (){	
	
    var menu = $.ligerMenu({ width: 120, items:
        [	
         	{ text: '添加', click: addTreeItem, icon: 'add' },
            { text: '删除', click: delTreeItem, icon: 'delete' } 
        ]
        });
	//树形
	manager = $("#tree1").ligerTree({
		 data:TreeData,
		 checkbox: false,
         idFieldName :'uuid',
         slide:false,
         parentIDFieldName:'parentId',
         textFieldName:'resourceName',
         onClick:onClick,
         isExpand: 2,
         onContextmenu: function (node, e){
             menu.show({ top: e.pageY, left: e.pageX });
             return false;
         }
     });
     
     
   //form表单
 	form =  $("#form").ligerForm({
     	  inputWidth: 150, labelWidth: 80, space: 40,
           fields: [ 
               { name: "uuid", newline: true, type: "text"},
               { name: "parentId", newline: true, type: "text"},
               { label: "序号", name: "seq", newline: true, type: "spinner",options:{type:"int"} },
               { label: "资源名称", name: "resourceName", newline: true, type: "text", validate:{ required: true,minlength:1}},
               { label: "菜单级别", name: "menuLevel", newline: true, type: "spinner",options:{type:"int",disabled:true} },
               { label: "URL", name: "url", newline: true, type: "text",width: 300},
               { label: "备注", name: "remark", newline: true, type: "text",width: 300,inputHeight:300}
           ],buttons :[
						{ text: '提交',click:submitForm}
                        ]
     });
     
 	setFieldsVisible(false);
 });
 
 //添加节点
function addTreeItem(){
    var node = manager.getSelected();
    if( node.data.uuid == ''){
    	alert("请先保存节点");
    	return;
    }
    var nodes = [];
    nodes.push({ resourceName: $("#txtNode").val(),parentId: node.data.uuid,menuLevel:node.data.menuLevel+1});
    if (node)
        manager.append(node.target, nodes); 
    else
        manager.append(null, nodes);
 }
 
 //删除节点
 function delTreeItem(){
	 var node = manager.getSelected();
	 if(node.data.parentId == '' || node.data.parentId == null){
		 $.ligerDialog.question('根节点不能删除');
		 return;
	 }
	 $.ligerDialog.confirm('你确定是要删除数据', function (yes) {		 
		 if(yes){
			 if( node.data.children == null){
				 $.ajax({ 
						url: '/sysResource/delSysResource', 
						data:{uuid : node.data.uuid}, 
						type: "post",
		     		   	dataType:'json',
						cache : false, 
						success: function(obj){
							$.ligerDialog.success(obj.message);
		                    manager.clear();
		                    manager.setData(obj.data);
						},
		                error: function (message) {
		                	$.ligerDialog.error('删除失败');
		                }
			 		});
			      manager.remove(node.target);
			 }else{
				 $.ligerDialog.question('请先删除子菜单');
			 }
		 }
	 });
 }
 
 //点击事件
 function onClick(note)
 {
	 clearForm();
     form.setData(note.data);
 }
 
 //清空表单
 function clearForm(){
	 form.setData({ 
		 uuid: '',
		 resourceName: '',
		 url:'',
		 menuLevel:0,
		 remark:'',
	     parentId:'',
	     seq:0
     });
 }
 
 //提交
 function submitForm(){
	 var data = form.getData();
/* 	 if(data.parentId == ''){
     	$.ligerDialog.error("不能编辑根节点");
     	return null;
	 } */ 
	 if (form.valid()){
			$.ajax({
                loading: '正在保存数据中...',
                type:'post',
                url: "/sysResource/saveOrUpdateSysResource",
     		   	dataType:'json',
                data: data,
                success: function (obj) {
                	$.ligerDialog.success(obj.message);
                	form.setData({uuid:obj.str});
/*                     manager.clear();
                     manager.setData(obj.data);*/
                },
                error: function (message) {
                	$.ligerDialog.error('提交失败');
                }
            });
	 }else{
         form.showInvalid();
	 }

 }
 
 //设置隐藏字段
 function setFieldsVisible(flag){
	 var files = ["uuid","parentId"];
	 form.setVisible(files,flag);
 } 
 
</script>	
</head>
<body>
    <input type="hidden" class="l-text" value="节点名" id="txtNode" style="display:block; float:left; margin-right:10px;" /> 

	<div style="float: left;width: 40%" >
        <h4>资源树</h4>
        <div class="tree"> 
            <ul id="tree1"></ul> 
        </div> 
    </div>
    <div style="float: left;">
        <h4>资源详情</h4>
        <div class="tree"> 
            <form id="form" ></form>
        </div> 
    </div>
    
    <div style="display:none"></div>
    
</body>
</html>

